<template>
  <div>
      <my-menu></my-menu>
      <div class="container clearfix">
          <div class="container-left">
            <readHeader :form="form" :title="title" :pageTotal="page.pageTotal" :page="page.page"></readHeader>
          </div>
          <div class="container-right">
              <my-type></my-type>
          </div>
      </div>
  </div>
</template>

<script>
import myMenu from '../components/menu'
import myType from '../components/type'
import readHeader from '../components/readList'
export default {
  data () {
    return {
      form: [],
      title: '',
      page: {
        page: 1,
        pageSize: 10,
        pageTotal: 1
      }
    }
  },
  components: {
    myMenu,
    myType,
    readHeader
  },
  methods: {
    getNewsByType (name) {
      this.$store.dispatch('getNews', {
        data: {
          type: name,
          page: this.page.page,
          pageSize: this.page.pageSize
        },
        cb: (res) => {
          if (res.data.code === 20000) {
            this.form = res.data.data
            this.page.pageTotal = parseInt(res.data.pageTotal)
            this.page.page = parseInt(res.data.page)
          }
        }
      })
    },
    getNewsSearch (name) {
      this.$store.dispatch('getNews', {
        data: {
          title: name,
          page: this.page.page,
          pageSize: this.page.pageSize
        },
        cb: (res) => {
          if (res.data.code === 20000) {
            this.form = res.data.data
            this.page.pageTotal = parseInt(res.data.pageTotal)
            this.page.page = parseInt(res.data.page)
          }
        }
      })
    }
  },
  mounted () {
    console.log(this.$route.params)
    if (this.$route.params.code === 0) {
      this.getNewsByType(this.$route.params.name)
    } else if (this.$route.params.code === 100) {
      this.getNewsSearch(this.$route.params.name)
    }

    this.title = this.$route.params.name
  },
  watch: {
    '$route' (to, form) {
      console.log(to)
      if (to.params.code === 0) {
        this.getNewsByType(this.$route.params.name)
      } else if (to.params.code === 100) {
        console.log('111')
        this.getNewsSearch(this.$route.params.name)
      }

      this.title = this.$route.params.name
    }
  }
}
</script>

<style lang="stylus" scoped>
  .container
    width 1200px
    margin 0 auto
    border 1px solid #f4f4f4
    .container-left
      width 800px
      float left
      overflow hidden
    .container-right
      margin-top 60px
      width 380px
      float right
</style>
